<!--
  Generated template for the HotelManagePage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>餐台点餐</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>
  <div *ngIf=" TableData.length <=0" class="empty">
    <page-empty></page-empty>
  </div>
  <div class="container" *ngIf=" TableData.length >0">
    <ng-container *ngFor="let item of TableData">
      <div class="floor" (click)="changeState(item)">
        <span>{{item.floor}}</span>
        <button end>
          <ion-icon name="{{item.show?'ios-arrow-dropup-outline':'ios-arrow-dropdown-outline'}}"></ion-icon>
        </button>
      </div>
      <div class="card-container" *ngIf="item.show" [ngClass]="item.show?'showItem animated slideInRight':'hideItem'">
        <button class="my-card" *ngFor="let table of item.tables;let i = index" (click)="showOptions(table,item.floorid)">
          <div class="my-card-header" [ngStyle]="{background:table.tableSite.color}">{{table.tableSite.name}}</div>
          <div class="my-card-content">
            <div>{{table.tablename}}</div>
            <!--<div>{{table.tableplace}}</div>-->
            <div>{{table.tablesize}}</div>
          </div>
          <div class="my-card-footer"></div>
        </button>
      </div>
    </ng-container>
  </div>
  <!--<button style="width: 100%;-->
  <!--font-size: 1.5rem;-->
  <!--display: flex;-->
  <!--flex-direction: column;-->
  <!--justify-content: center;-->
  <!--align-items: center;-->
  <!--background-color: #66ccff;-->
  <!--border-radius: 3px" (click)="setStorage()">-->
    <!--<span>首次加载请点击本按钮初始化数据到本地存储</span>-->
    <!--<span>然后刷新页面 刷新数据也点我</span>-->
  <!--</button>-->
</ion-content>
